<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf8" />
        <title>AJAX Demo</title>
        <link rel="shortcut icon" href="styles/images/favicon.ico">
    </head>
    <body>
        <h1>AJAX Demo</h1>
        <p> Send request to <a href="test.json">test.json</a><br><br>
        <input type="button" value="AJAX Demo (JSON)" onclick="ajax_demo_json();">
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input type="button" value="AJAX Demo (Text)" onclick="ajax_demo_text();">
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input type="button" value="AJAX Demo POST (async=true)" onclick="ajax_demo_post_async();">
        </div>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <input type="button" value="AJAX Demo POST (async=false)" onclick="ajax_demo_post_sync();">
        </div>
        <script src="js/ajax.js"></script>
        <script>
        function ajax_demo_json() {
            ajax({
                url: 'test.json',
                parse_json: true,
                success: function(data) {
                    var txt = 'Error: ' + data.error + "\n";
                    txt += 'Error description: ' + data.errormessage + "\n\n";
                    txt += 'Information about Image[0]' + "\n";
                    txt += '    Title: ' + data.data[0].title + "\n";
                    txt += '    Description: ' + data.data[0].description + "\n";
                    txt += '    File: ' + data.data[0].filename + "\n";
                    txt += '    Date: ' + data.data[0].date + "\n";
                    alert(txt);
                },
                error: function() { alert('AJAX ERROR :('); }
            });
        }

        function ajax_demo_text() {
            ajax({
                url: 'test.json',
                method: 'GET',
                parse_json: false,
                success: function(data) {
                    alert(data);
                },
                error: function() { alert('AJAX ERROR :('); }
            });
        }

        function ajax_demo_post_async() {
            ajax({
                url: 'post.php',
                method: 'POST',
                data: 'foo=bar1',
                parse_json: false,
                success: function(data) {
                    alert(data);
                },
                error: function() { alert('AJAX ERROR :('); }
            });

            alert('Test async');
        }

        function ajax_demo_post_sync() {
            ajax({
                url: 'post.php',
                method: 'POST',
                data: 'foo=bar2',
                async: false,
                parse_json: false,
                success: function(data) {
                    alert(data);
                },
                error: function() { alert('AJAX ERROR :('); }
            });

            alert('Test sync');
        }
        </script>
    </body>
</html>